<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="jq/jquery1.9/jquery-1.9.0.js"></script>
    <script>
        $(function () {
            $("input:eq(0)").click(function () {
                $("p:contains('wbs23022'):last").css("background","red");
            });
            $("input:eq(1)").click(function () {
                $("p:empty").css("background","red").html("我原来是一个空的p标签");
            });
            $("input:eq(2)").click(function () {
                $("div:has(span#hello)").css("background","#00F0F0");
            });
            $("input:eq(3)").click(function () {
                console.log( $("p:not(:empty)").length);
                $("p:not(:empty)").css("background","yellow");
            });
            $("input:eq(4)").click(function () {
                console.log( $("p:parent").length);

                // p作为父元素
                $("p:parent").css("background","yellow");
            });
        });
    </script>
</head>

<body>
    <input type="button" value="选择包含wbs23022的最后一个p元素">
    <input type="button" value="选择空的p元素">
    <input type="button" value="选择包含id为hello的span元素的div元素">
    <input type="button" value="选择非空的p元素">
    <input type="button" value="选择非空的p元素(方式二)">
    <p>welcome to haha</p>
    <div>我是div
        <p class="hello">hello haha</p>
    </div>
    <div>我是div
        <span id="hello">hello</span>
        <p>今天星期二</p>
    </div>
    <p>welcome to wbs23022</p>
    <p></p>
    <p>hello world</p>
    <p>welcome to wbs23022</p>
    <p>我是p</p>
    <div>happy wbs23022</div>
    <p>我是p
        <span>span</span>
    </p>
</body>

</html>